<!doctype html>
<html>
	<head>
	<meta content="text/html; charset=UTF-8" http-equiv="content-type" />
	<meta name="viewport" content="width=device-width,initial-scale=1">
	<style>
		html,body{
			margin:0;
			padding: 0;
		}
		#mycanvas_container{
			overflow: hidden;		
		}
	</style>
	
	</head>
	<body>
		<div id="mycanvas_container"></div>
	</body>
	<script type="module">	
		import { jmGraph } from "../../index.js";
        
        //开发模式下，引用jmGraph.js，请使用这种方式，内部会初始化组件
		var g = jmGraph.create('mycanvas_container', {
			width: 800,
			height: 600,
			mode: '2d',
			style: {
				fill: '#000'
			}
		});
		
		init(g);		
			
		function init(g){
			//g.style.fill = '#000'; //画布背景
			var style = {
                stroke: '#A2D84B',
                fill: 'transparent',
                shadow: '0,0,10,#fff'
			};
			//style.opacity = 0.2;		

			//创建
            var prismatic = g.createShape('prismatic',{
                style:style,
                center:{x:200,y:150},
                width:120,
                height:80
            });		
			//prismatic.canMove(true);
            g.children.add(prismatic);
            

			function update() {
				if(g.needUpdate) g.redraw();
				requestAnimationFrame(update);
			}

			update();
		}
	</script>
</html>